import {useEffect, useState} from 'react'

const useMousePosition = () => {
  const [position, setPosition] = useState({x: 0, y: 0 })
  useEffect(() => {
    const updateMouse = (e) => {
      setPosition({ x: e.clientX, y: e.clientY })
    }
    document.addEventListener('mousemove', updateMouse)
    return () => {
      document.removeEventListener('mousemove', updateMouse)
    }
  },[])
  return position
}

export default useMousePosition


/*
//使用
import React from 'react'
import useMousePosition from './useMousePosition'

function App() {
  const position = useMousePosition()
  return (
    <div>
      <div>x: {position.x}</div>
  <div>y: {position.y}</div>
  </div>
)
}*/
